<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<!-- head -->
<div th:replace="~{fragment/head :: head}"></div>
<style>
    .green{
        color: green;
    }
    .black{
        color: gray;
    }

    .innerbox::-webkit-scrollbar {
        width: 4px;
    }

    .innerbox::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
        background: rgba(0, 0, 0, 0.2);
    }

    .innerbox::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
        border-radius: 0;
        background: rgba(0, 0, 0, 0.1);
    }

</style>
<body th:class="((${status} != 1) and (${status} != 51) and (${status} != 5) and (${status}) != 4) ? 'stretch-layout sticky-navigation':''">
    <!-- begin::Create Event Modal 修改信息弹出框-->
    <div class="modal fade" id="compose-admin" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header" >
                    <h5 class="modal-title">个人信息</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i class="ti-close"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <form autocomplete="off" class="form-group" action="/customer-service/updatePassword" method="post">
                        <div class=" row">
                            <label class="col-sm-3 col-form-label" >邮箱</label>
                            <div class="col-sm-9">
                                <input  type="text" class="form-control" th:value="(${session.personalInformation} != null)?${session.personalInformation.email}:''" name="email">
                            </div>
                        </div>

                        <div class=" row">
                            <label class="col-sm-3 col-form-label" >昵称</label>
                            <div class="col-sm-9">
                                <input  type="text" name="nickname" class="form-control" th:value="(${session.personalInformation} != null)?${session.personalInformation.nickname}:''">
                            </div>
                        </div>

                        <div class=" row">
                            <label class="col-sm-3 col-form-label" >真实姓名</label>
                            <div class="col-sm-9">
                                <input  type="text" name="realname" class="form-control" th:value="(${session.personalInformation}!=null)?${session.personalInformation.realname}:''">
                            </div>
                        </div>

                        <div class=" row">
                            <label class="col-sm-3 col-form-label" >服务组</label>
                            <div class="col-sm-9">
                                <input  type="text" name="servicegroup" class="form-control" th:value="(${session.personalInformation}!=null)?${session.personalInformation.servicegroup}:''" >
                            </div>
                        </div>
                        <div class=" row">
                            <label class="col-sm-3 col-form-label" >工作角色</label>
                            <div class="col-sm-9">
                                <input  type="text" name="servicerole" class="form-control" th:value="(${session.personalInformation}!=null)?${session.personalInformation.servicerole}:''">
                            </div>
                        </div>

                        <div class="form-group" align="center">
                            <label class="col-sm-3"></label>
                            <div class="col-sm-9">
                                <button type="submit" id="btn-save" class="btn btn-primary">
                                    <i data-feather="send" class="mr-2"></i>
                                    确定
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" tabindex="-1" role="dialog" id="worker-compose">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">添加工单</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i class="ti-close"></i>
                    </button>
                </div>
                <div class="modal-body">

                    <form action="/orderManager/workorderadd" method="post">
                        <div class="form-group">
                            <input name="title" type="text" class="form-control tagsinput" placeholder="工单名称">
                        </div>
                        <div class="form-group">
                            <input name="cclist" type="text" class="form-control" placeholder="创建人" required>
                        </div>
                        <div class="form-group">
                            <div class="custom-file">
                                <input type="file" class="custom-file-input" multiple id="customFileLangHTML">
                                <label class="custom-file-label" for="customFileLangHTML"
                                       data-browse="Select files">工单文件</label>
                            </div>
                        </div>
                        <div>
                            <input type="input" class="compose-quill-editor mb-3 form-control " placeholder="描述"
                                   name="orderdesc">
                            <div class="d-flex justify-content-between">
                                <div class="compose-quill-toolbar">
                                            <span class="ql-formats mr-0">
                                                <button class="ql-bold"></button>
                                                <button class="ql-italic"></button>
                                                <button class="ql-underline"></button>
                                                <button class="ql-link"></button>
                                                <button class="ql-image"></button>
                                            </span>
                                </div>
                                <button type="submit" class="btn btn-primary">
                                    <i data-feather="send" class="mr-2"></i>
                                    添加
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- end::Create Event Modal -->
    <!-- begin::preloader-->
    <div th:replace="~{fragment/preload :: preload}"></div>
    <!-- end::preloader -->

    <!-- begin::navigation -->
    <div th:replace="~{fragment/navigation :: navigation(${status})}"></div>
    <!-- end::navigation -->

    <!-- begin::main -->
    <div id="main">

        <!-- begin::header -->
        <div th:replace="~{fragment/header :: header}"></div>
        <!-- end::header -->

        <!-- begin::main-content -->
        <div class="main-content">
            <!-- begin::container -->

            <!-- 首页 -->
            <div th:replace="~{page/home :: index(${status})}"></div>
            <!-- 会话 -->
            <div th:replace="~{page/chat :: chat(${status})}"></div>
            <!-- 聊天历史 -->
            <div th:replace="~{page/chatHistory :: index(${status},${ssss},${history},${visitor},${sd},${customer},${tag})}"></div>
            <!-- 访客 -->
            <div th:replace="~{page/visitors :: index(${status})}"></div>
            <!--   访客会话-->
            <div th:replace="~{page/visitorchats :: index(${status})}"></div>
            <!-- 客户管理 -->
            <div th:replace="~{page/customer-list :: customerList(${status},${iPageCurrent},${pages},${customerInfoList})}"></div>
            <div th:replace="~{page/individualCustomerInfo :: customerInfo(${status},${session.CurrentId},${c},${stringCreateTime},${stringLastedTime},${stringUpdateTime},${serviceTime},${goodReview},${updateTime},${WorkOrderList},${cs},${blackLists},${realName},${blackTime})}"></div>
            <!-- 工单 -->
            <div th:replace="~{page/workorders :: index(${status})}"></div>

            <!-- end::container -->
        </div>
        <!-- end::main-content -->

        <!-- begin::footer -->
        <div th:replace="~{fragment/footer :: footer}"></div>
        <!-- end::footer -->

    </div>
    <!-- end::main -->

    <!-- Plugin scripts -->
    <script src="vendors/bundle.js"></script>

    <!-- Chart js -->
    <script src="vendors/charts/chartjs/chart.min.js"></script>

    <!-- Apex chart -->
    <script src="vendors/charts/apex/apexcharts.min.js"></script>

    <!-- Circle progress -->
    <script src="vendors/circle-progress/circle-progress.min.js"></script>

    <!-- Peity -->
    <script src="vendors/charts/peity/jquery.peity.min.js"></script>
    <script src="assets/js/examples/charts/peity.js"></script>

    <!-- Datepicker -->
    <script src="vendors/datepicker/daterangepicker.js"></script>

    <!-- Slick -->
    <script src="vendors/slick/slick.min.js"></script>

    <!-- Vamp -->
    <script src="vendors/vmap/jquery.vmap.min.js"></script>
    <script src="vendors/vmap/maps/jquery.vmap.usa.js"></script>
    <script src="assets/js/examples/vmap.js"></script>

    <!-- jQuery -->
    <script src="vendors/jquery/jquery-3.2.1.min.js"></script>

    <!-- Dashboard scripts -->
    <script src="assets/js/examples/dashboard.js"></script>

    <!-- App scripts -->
    <script src="assets/js/app.min.js"></script>

    <!-- Tagsinput -->
    <script src="vendors/tagsinput/bootstrap-tagsinput.js"></script>
    <script src="assets/js/examples/tagsinput.js"></script>

    <!-- DataTable -->
    <script src="vendors/dataTable/jquery.dataTables.min.js"></script>
    <script src="vendors/dataTable/dataTables.bootstrap4.min.js"></script>
    <script src="vendors/dataTable/dataTables.responsive.min.js"></script>
    <script src="assets/js/examples/datatable.js"></script>

    <!--工单的script---begin -->
    <!-- Tagsinput -->
    <script src="vendors/tagsinput/bootstrap-tagsinput.js"></script>
    <script src="assets/js/examples/tagsinput.js"></script>

    <!-- quill -->
    <script src="vendors/quill/quill.js"></script>
    <!-- begin::lightbox -->
    <script src="vendors/lightbox/jquery.magnific-popup.min.js"></script>
    <script src="assets/js/examples/lightbox.js"></script>
    <!-- Prism -->
    <script src="vendors/prism/prism.js"></script>
    <!-- 首页逻辑 -->
    <script th:inline="javascript">
        var ssss = [[${ssss}]]

        function fuzzyMatch(str, key){
            let index = -1, flag = false;
            for(var i = 0, arr = key.split(""); i < arr.length; i++ ){
                //有一个关键字都没匹配到，则没有匹配到数据
                if(str.indexOf(arr[i]) < 0){
                    break;
                }else{
                    let match = str.matchAll(arr[i]);
                    let next = match.next();
                    while (!next.done){
                        if(next.value.index > index){
                            index = next.value.index;
                            if(i === arr.length - 1){
                                flag = true
                            }
                            break;
                        }
                        next = match.next();
                    }

                }
            }
            return flag
        }

        $(document).ready(function () {
            // 点击设置菜单按钮后，保证不关闭弹出框
            $(function () {
                let status = [[${status}]];
                if (status == 8 || status == 9 || status == 10 || status == 11 || status == 12) {
                    $('#drag').addClass("open");
                }
            })

            // 关闭notice按钮事件
            $('#closeNoticeBtn').click(function () {
                $('#notice').removeClass("show");
            })
            // 关闭notice按钮事件
            $('#closeSysMsgBtn').click(function () {
                $('#sysMsg').removeClass("show");
            })

            // 缩小nav按钮时间
            $('#smallNavBtn').click(function () {
                if (!sessionStorage.getItem("navStatus")){
                    $(document.body).setAttribute("class","small-navigation")
                    sessionStorage.setItem("navStatus", "small")
                }else {
                    if (sessionStorage.getItem("navStatus") == "small"){
                        $("document.body").removeClass("small-navigation")
                        sessionStorage.setItem("navStatus", "open")
                    }else if (sessionStorage.getItem("navStatus") == "open") {
                        $(document.body).setAttribute("class","small-navigation")
                        sessionStorage.setItem("navStatus", "small")
                    }
                }
            })
            $('#searchSession').click(function () {
                console.log(ssss)
                console.log($('#query').val(),ssss.length)
                for (let i = 0; i < ssss.length; i++){
                    if (fuzzyMatch(ssss[i].visitorname,$('#query').val())){
                        $('#pills-home').scrollTop(i * $('.visitor').innerHeight());
                        $($('.visitor')[i]).css("background-color","#EAEAEA")
                        setTimeout(function () {
                            $($('.visitor')[i]).css("background-color","white")
                        }, 300)
                        continue;
                    }
                }
            })
        })
    </script>
    <!-- 日期格式化 -->
    <script>
        Date.prototype.format = function(fmt) {
            var o = {
                "M+" : this.getMonth()+1,                 //月份
                "d+" : this.getDate(),                    //日
                "h+" : this.getHours(),                   //小时
                "m+" : this.getMinutes(),                 //分
                "s+" : this.getSeconds(),                 //秒
                "q+" : Math.floor((this.getMonth()+3)/3), //季度
                "S"  : this.getMilliseconds()             //毫秒
            };
            if(/(y+)/.test(fmt)) {
                fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
            }
            for(var k in o) {
                if(new RegExp("("+ k +")").test(fmt)){
                    fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
                }
            }
            return fmt;
        }
    </script>
    <script>
        function getserachFrom(){
            var title01=serachform.title.value();
            console.log("这是搜索按钮-----"+title);
            location.href="/orderManager/search?title="+title01;
        }
    </script>
    <script th:inline="javascript">


        var count = 0; //记录添加的复选框的个数
        var result="";
        var isSelectAll = false; //是否全选
        var list =[[${list}]];
        var replylist=[[${wreply}]]
        new Quill('.compose-quill-editor', {
            modules: {
                toolbar: ".compose-quill-toolbar"
            },
            placeholder: "描述... ",
            theme: "snow"
        });

        new Quill('.reply-email-quill-editor', {
            modules: {
                toolbar: ".reply-email-quill-toolbar"
            },
            placeholder: "回复... ",
            theme: "snow"
        });


        $(function () {
            $(document).on('click', '.app-block .app-content .app-action .action-left input[type="checkbox"]', function () {


                // 全选键
                $('.app-lists ul li input[type="checkbox"]').prop('checked', $(this).prop('checked'));
                // 打勾
                if ($(this).prop('checked'))
                {

                    $('.app-lists ul li input[type="checkbox"]').closest('li').addClass('active');
                    isSelectAll = true;
                    var cks=document.getElementsByName("checkos");
                    for(var i=0;i<cks.length;i++){
                        cks[i].checked=flag;}

                } else {
                    $('.app-lists ul li input[type="checkbox"]').closest('li').removeClass('active');
                    isSelectAll = false;
                    // var cks=document.getElementsByName("checkos");
                    // for(var i=0;i<cks.length;i++){
                    //     cks[i].checked=flag;}
                }
            });

            $(document).on('click', '.app-lists ul li input[type="checkbox"]', function () {
                if ($(this).prop('checked')) {
                    $(this).closest('li').addClass('active');
                    result += $(this).val()+",";
                    count++;
                    console.log(count+"   "+result);
                } else {

                    $(this).closest('li').removeClass('active');
                    var res1=$(this).val()+",";
                    result=result.replaceAll(res1,"");
                    count--;
                    console.log(count+"   "+result);
                }
            });

            $(document).on('click', '.app-block .app-content .app-content-body .app-lists ul.list-group li.list-group-item', function (e) {
                if (!$(e.target).is('.custom-control, .custom-control *, a, a *')) {
                    var ids=$(this).val();
                    console.log("当前的index为"+"   "+$(this).index());
                    console.log(list[$(this).index()]);

                    // $('#detail01').text(list[$(this).index()].id)//ok


                    $('#detitle').text(list[$(this).index()].title)//ok
                    $('#deworkType').text(list[$(this).index()].worktype)
                    $('#deorderDesc').text(list[$(this).index()].orderdesc)

                    //详情的删除按钮
                    $('#dedetele').val(list[$(this).index()].id)

                    //回复面板详情
                    $('#wreplycontent').text(replylist[$(this).index()].content)
                    $('#wreplytime').text(new Date(replylist[$(this).index()].replytime).format("yyyy-MM-dd hh:mm"))

                    //修改信息详情
                    $('#validationCustom01').val(list[$(this).index()].worktype)
                    $('#validationCustom02').val(list[$(this).index()].title)
                    $('#validationCustom03').val(list[$(this).index()].orderdesc)

                    $('#validationCustom05').val(list[$(this).index()].cclist)
                    $('#validationCustom06').val(list[$(this).index()].customerservicegroupid)
                    $('#validationCustom07').val(list[$(this).index()].customerserviceid)
                    $('#validationCustom08').val(list[$(this).index()].customerid)
                    $('#validationCustom09').val(list[$(this).index()].channel)

                    // var oldTime=(new Date(list[$(this).index()].updatetime)).getTime()
                    // var curTime = new Date(oldTime-8*60*60*1000).format("yyyy-MM-dd hh:mm")
                    $('#validationCustom10').val(new Date(list[$(this).index()].updatetime))

                    // var oldTime=(new Date(list[$(this).index()].createtime)).getTime()
                    // var curTime = new Date(oldTime-8*60*60*1000).format("yyyy-MM-dd hh:mm")
                    $('#validationCustom11').val(new Date(list[$(this).index()].updatetime))
                    $('#upid').val(list[$(this).index()].id)

                    $("option:contains('"+list[$(this).index()].priority+"')").attr("selected",true)
                    $("option:contains('"+list[$(this).index()].state+"')").attr("selected",true)

                    $('#decreatetime').text("    "+new Date(list[$(this).index()].createtime).format("yyyy-MM-dd hh:mm"))
                    $('.app-detail').addClass('show').one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function () {
                        $('.app-block .app-content .app-content-body .app-detail .app-detail-article').niceScroll().resize();
                    });
                }
            });



            $('#sousuo').click(function() {

                var workid=$('#title').val();
                console.log("这是搜索值-----"+workid);
                // location.href="/orderManager/del?workid="+workid;

            })

            $(document).on('click', 'a.app-detail-close-button', function () {
                $('.app-detail').removeClass('show');
                return false;
            });

            $(document).on('click', '.app-sidebar-menu-button', function () {
                $('.app-block .app-sidebar, .app-content-overlay').addClass('show');
                // $('.app-block .app-sidebar .app-sidebar-menu').niceScroll().resize();
                return false;
            });

            $(document).on('click', '.app-content-overlay', function () {
                $('.app-block .app-sidebar, .app-content-overlay').removeClass('show');
                return false;
            });
            $('#mulDel').click(function () {
                if(!confirm("确定要删除这些工单吗？")){
                    return ;
                }
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的工单id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/muldel?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/muldel?list="+str;
                }

                // //去掉字符串末尾的‘&’
                // str=str.substring(0, str.length-1);


                // location.href="/orderManager/muldel?list="+result
            })


            // 紧急优先级
            $('#starjj').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/starjinji?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/starjinji?list="+str;
                }
            })
            // 高优先级
            $('#stargyxj').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/stargyxj?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/stargyxj?list="+str;
                }
            })

            //中优先级
            $('#starzyxj').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/starzyxj?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/starzyxj?list="+str;
                }
            })
            //设置低优先级绑定
            $('#stardyxj').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/stardyxj?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/stardyxj?list="+str;
                }
            })
            //设置为已完成
            $('#starywc').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/starywc?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/stardywc?list="+str;
                }
            })

            //设置为未分配
            $('#starwfp').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/starwfp?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/starwfp?list="+str;
                }
            })

            //设置为处理中
            $('#starclz').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/starclz?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/starclz?list="+str;
                }
            })


            //设置为待处理
            $('#stardcl').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/stardcl?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/stardcl?list="+str;
                }
            })

            //设置为已关闭
            $('#starygb').click(function () {
                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/starygb?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/starygb?list="+str;
                }
            })
            //下载事件绑定
            $('#outputworkorder').click(function () {

                if(isSelectAll=true){
                    var cks=document.getElementsByName("checkos");
                    var str="";
                    //拼接所有的图书id
                    for(var i=0;i<cks.length;i++){
                        if(cks[i].checked){
                            str+=cks[i].value+",";
                            console.log(str);
                            location.href="/orderManager/voutputworkorder?list="+str;
                        }
                    }
                }
                else{
                    console.log(str);
                    location.href="/orderManager/voutputworkorder?list="+str;
                }
            })
            // 下载
            $('#outputworkorder').click(function () {
                toastr.options = {
                    timeOut: 3000,
                    progressBar: true,
                    showMethod: "slideDown",
                    hideMethod: "slideUp",
                    showDuration: 200,
                    hideDuration: 200
                };
                toastr.success('下载成功');
            })
        });
    </script>
    <!--访问者-->
    <script src="assets/js/examples/sweet-alert.js"></script>
    <!-- Dashboard scripts -->
    <script src="assets/js/examples/dashboard.js"></script>
    <!-- begin::lightbox -->
    <script src="vendors/lightbox/jquery.magnific-popup.min.js"></script>
    <script src="assets/js/examples/lightbox.js"></script>
    <script th:inline="javascript">
        let arrd1 = [[${session.WorkOrder1}]];
        let arrd2 = [[${session.WorkOrder2}]];
        let arrd3 = [[${session.WorkOrder3}]];
        let arrd4 = [[${session.WorkOrder4}]];
        $(function indexChat() {
            if ($('#indexChat').length > 0) {
                var options = {
                    chart: {
                        height: 375,
                        type: 'bar',
                        toolbar: {
                            show: false
                        }
                    },
                    plotOptions: {
                        bar: {
                            horizontal: false,
                            columnWidth: '55%',
                            endingShape: 'rounded'
                        },
                    },
                    dataLabels: {
                        enabled: false
                    },
                    stroke: {
                        show: true,
                        width: 2,
                        colors: ['transparent']
                    },
                    series: [{
                        name: '未分配',
                        data: arrd1
                    }, {
                        name: '待处理',
                        data: arrd2
                    }, {
                        name: '处理中',
                        data: arrd3
                    },{
                        name: '已解决',
                        data: arrd4
                    }],
                    xaxis: {
                        categories: ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sept','Oct','Nov','Dec'],
                    },
                    fill: {
                        opacity: 1

                    },
                    tooltip: {
                        y: {
                            formatter: function (val) {
                                return   val + " 任务"
                            }
                        }
                    }
                };

                var chart = new ApexCharts(
                    document.querySelector("#indexChat"),
                    options
                );

                chart.render();
            }
        })
    </script>


    <script>
        window.easemobim = window.easemobim || {};
        easemobim.config = {
            title:"测试机器人",
            userId: "userId",
            onready: function(){
                window.easemobim.bind();
            }
        };
    </script>
    <script th:if="${status}==1"   src='//robot.easemob.com/webim/easemob.js?tenantId=56831&robotId=bfb05602-6150-423f-b169-461e3e9b788e' async='async'></script>

</body>
</html>